#parse("header.html")
  <div class="contant">
    <div class="wrapper row">
      <div class="col-md-1"></div>
      <div class="col-md-10 row">
        <div class="col-md-9 leftSection">
          <ul class="articles">
            #foreach($vo in $vos)
            <li class="blogAticle">
              <div class="articleHeader">
                <p><a href="/article/$!{vo.article.id}">$!{vo.article.title}</a></p>
              </div>
              <div class="articleContent">
                <p>$!{vo.article.describes}</p>
              </div>
              <div class="articleFooter">
                <ul>
                  <li><i class="fa fa-calendar fa-1x" aria-hidden="true"></i><span>$date.format('yyyy-MM-dd', $!{vo.article.createdDate})</span></li>
                  <li><i class="fa fa-eye" aria-hidden="true"></i><span>$!{vo.clickCount}</span></li>
                  <li><i class="fa fa-list fa-1x" aria-hidden="true"></i><span>$!{vo.article.category}</span></li>
                  <li><i class="fa fa-tags fa-1x" aria-hidden="true"></i>
                    #foreach($tag in $vo.tags)
                    <span>$!{tag.name}</span>
                    #end
                  </li>
                  <li class="readMore"><a href="/article/$!{vo.article.id}">read more</a></li>
                </ul>
              </div>
            </li>
            #end
          </ul>
          <div class="paginationWapper">
            <ul class="pagination">
              #if($pagination.current > 1)
              <li>
                <a href="/category/$!{category}?pageId=$!{pagination.prePage}">&laquo;</a>
              </li>
              #else
              <li class="disabled">
                <a href="">&laquo;</a>
              </li>
              #end
              <li><a href="">$!{pagination.current}/$!{pagination.lastPage}</a></li>
              <!--{% for p in pagination.iter_pages() %}-->
                <!--{% if p %}-->
                  <!--<li><a href="{{ url_for('index', page = p) }}">{{p}}</a></li>-->
                <!--{% else %}-->
                <!--<li><a href="{{ url_for('index', page = p) }}">...</a></li>-->
                <!--{% endif %}-->
              <!--{% endfor %}-->
              #if($pagination.current < $pagination.lastPage)
              <li>
                <a href="/category/$!{category}?pageId=$!{pagination.nextPage}">&raquo;</a>
              </li>
              #else
              <li class="disabled">
                <a href="">&raquo;</a>
              </li>
              #end
            </ul>
          </div>
        </div>
        <div class="col-md-3 rightSection">
          <div class="side categories">
            <div class="header"><i class="fa fa-list-ul" aria-hidden="true"></i><span>Categories</span></div>
            <ul>
              <li><a href="/category/Java?pageId=1">Java</a><span>($!{categoryCount.Java})</span></li>
              <li><a href="/category/Web?pageId=1">Web</a><span>($!{categoryCount.Web})</span></li>
              <li><a href="/category/Linux?pageId=1">Linux</a><span>($!{categoryCount.Linux})</span></li>
              <li><a href="/category/分布式系统?pageId=1">分布式系统</a><span>($!{categoryCount.Distributed})</span></li>
              <li><a href="/category/数据库?pageId=1">数据库</a><span>($!{categoryCount.Database})</span></li>
              <li><a href="/category/算法?pageId=1">算法</a><span>($!{categoryCount.Algorithm})</span></li>
              <li><a href="/category/其它?pageId=1">其它</a><span>($!{categoryCount.Other})</span></li>
            </ul>
          </div>
          <div class="side tags">
            <div class="header"><i class="fa fa-tags" aria-hidden="true"></i><span>Tags</span></div>
            <div id="tagCloud">
              #foreach($tag in $tags)
              <a href="/tag/$!{tag.id}?pageId=1" rel="$!{tag.count}">$!{tag.name}</a>
              #end
            </div>
          </div>
          <div class="side hotArticles">
            <div class="header"><i class="fa fa-file-text" aria-hidden="true"></i><span>HotArticles</span></div>
            <ul>
              #foreach($hotArticle in $hotArticles)
              #set($str=$!hotArticle.title)
              #if($str.length()>19)
              #set($str=$str.substring(0,19))
              <li><a href="/article/$!{hotArticle.id}">$str...</a></li>
              #else
              <li><a href="/article/$!{hotArticle.id}">$str</a></li>
              #end
              #end
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
#parse("footer.html")
